<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<#include "../common/head.ftl">

<body class="gray-bg">
<#include "../common/modal.ftl">

<#include "../common/delete.ftl">

<#include "../common/entity.ftl">

<div class="modal fade" id="EditMeeting" style="overflow-y:auto !important;" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="width:90%;">
        <div class="modal-content">
            <div class="modal-body" style="padding:0;"></div>
            <div class="modal-footer">
                <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-white" id="email">邮箱分享</button>
            </div>
        </div>
    </div>
</div>

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-content" id="search">
                    <div class="search-box">
                        记录员：
                        <div><input type="search" name="username"></div>
                        会议名称：
                        <div><input type="search" name="title"></div>
                        起始时间：
                        <div><input type="text" name="startTime" readonly class='date' value=''></div>
                        结束时间：
                        <div><input type="text" name="endTime" readonly class='date' value=''></div>
                        <button class='btn btn-search'>搜索</button>
                    </div>
                    <div class='hr'></div>
                    <div class='top_row'>
                        <div class="pull-right page">
                            每页显示:<span class='page_active'>10</span><span>20</span><span>30</span><span>40</span><span>50</span>
                        </div>
                    </div>
                    <table class="table table-striped table-bordered table-hover dataTables-example">
                        <thead>
                        <tr>
                            <th name="id" style="display:none;">id</th>
                            <th name="username">记录员</th>
                            <th name="title">会议名称</th>
                            <th name="startTime">会议开始时间</th>
                            <th name="endTime">会议预定结束时间</th>
                            <th name="realEndTime">会议实际结束时间</th>
                            <th name="">功能选项</th>
                        </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                    <div class="paging"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="${basePath}/js/jquery.min.js?v=2.1.4"></script>
<script src="${basePath}/js/page.js"></script>
<script src="${basePath}/js/common.js"></script>
<script src="${basePath}/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${basePath}/js/bootstrap-datepicker.min.js"></script>
<script src="${basePath}/js/bootstrap-datepicker.zh-CN.min.js"></script>

<script type="text/javascript">
    var table = initTable("${basePath}/manager/findFileRecordList", "search", $("table"), "paging");
    EditEntity("编辑会议记录", "", $("table"), null, null, null, null,
            "${basePath}/function/deleteFileRecordById",
            table.search);
    $("table").on("click", "tbody tr td a:first-child", function () {
        var id = $(this).parents("tr").find("td:first").text();
        $("#EditMeeting").find('.modal-body').load("${basePath}/function/fileRecordForm/" + id);
        $("#EditMeeting").modal("show").attr("meetingId", id);
    })

    function getPersonListByName(username) {
        AsyncGet("${basePath}/function/getPersonListByName", {username: username}, function (value) {
            $("#EditEntity .form-group:eq(1)").empty();
            for (var i = 0; i < value.length; i++) {
                var div = $("<div style='cursor:pointer;height:62px;'></div>");
                var colsm4 = $("<div class='col-sm-4'></div>");
                var img = $("<img class='img-circle'>");
                img.attr("src", "${basePath}/function/getAvatar?avatar=" + value[i].avatar);
                colsm4.append(img);
                var label = $('<label class="col-sm-8 control-label"></label>');
                label.text(value[i].username);
                div.append(colsm4).append(label).attr("email", value[i].email);
                $("#EditEntity .form-group:eq(1)").append(div);
            }
        })
    }

    $("#EditEntity").on("click", "form .form-group:eq(1)>div", function () {
        $(this).toggleClass("active");
    });
    $("#EditEntity").on("keyup", "[name='username']", function () {
        getPersonListByName($(this).val());
    })
    $("#email").click(function () {
        $("#EditEntity").modal("show");
        $("#EditEntity").find('.modal-title').text("选择分享人");
        $("#EditEntity .modal-footer button:last").text("确认");
        $("#EditEntity .modal-body").load("${basePath}/function/searchPersonByName", function () {
            getPersonListByName($("#EditEntity [name='username']").val());
        });
    })
    $("#EditEntity .modal-footer button:last").click(function () {
        $("#EditEntity form .form-group:eq(1) div.active").each(function () {
            var email = $(this).attr("email");
            var meetingId = $("#EditMeeting").attr("meetingId");
            AsyncPost("${basePath}/function/sendEmail", {email: email, meetingId: meetingId});
        })
        $("#EditEntity").modal("hide");
    })
    $(".date").datepicker({
        format: 'yyyy-mm-dd',
        language: 'zh-CN',
        autoclose: true,
        todayBtn: true,
        todayHighlight: true
    }).on('changeDate', function (ev) {
        if ($(this).is("[name='startTime']")) {
            var year = ev.date.getFullYear();
            var month = ev.date.getMonth() + 1;
            if (month < 10) {
                month = "0" + month;
            }
            var date = ev.date.getDate() + 1;
            if (date < 10) {
                date = "0" + date;
            }
            $("[name='endTime']").datepicker("setStartDate", year + "-" + month + "-" + date);
            $("[name='endTime']").val('');
        }

    });

</script>

</body>
</html>